<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>表单练习</title>
		<!-- 引入第三方css文件 -->
		<link rel="stylesheet"href="css/bootstrap.min.css"/>
		<style>
			ul{
				list-style: none;/*去掉每个li前面的点*/
			}
			li{
				float:left;/*li不换行,紧跟在后面*/
				margin-right: 8px;
				color: white;/*字体颜色白色*/
				border-radius: 5px;
			}
			li:hover{/*鼠标移入*/
				background-color: aqua;
			}
			a{
				text-decoration: none;/*取消超链接下的下划线*/
				color:white;
			}
		</style>
	</head>
	<body>
		<div class="container">
			<h1>学生信息管理系统mis</h1>
			<div class="form-group">
				<!-- label标签 for属性光标定位，点击是可以锁定对应id的框 -->
				<label for="name">姓名：</label>
				<!-- 输入文本框 -->
				<input type="text"name="name"id="name"
				class="form-control"
				placeholder="请输入姓名..."
				/>
			</div>
			
			<div class="form-group">
				<label for="age">年龄：</label>
				<input type="number"name="age"id="age"
				class="form-control"
				placeholder="请输入年龄..."
				/>
			</div>
			
			<div class="form-group">
				<label for="sex">性别：</label>
				<!-- radio互斥，同名会只能选择一个 -->
				<div class="radio-inline">
					<input type="radio"name="sex"id="sex">男
				</div>
				<div class="radio-inline">
					<input type="radio"name="sex"id="sex">女
				</div>
			</div>
			
			<div class="form-group">
				<label for="hobby">爱好：</label>
				<div class="checkbox-inline">
					<input type="checkbox"name="hobby"id="hobby">乒乓球
				</div>
				<div class="checkbox-inline">
					<input type="checkbox"name="hobby"id="hobby">爬山
				</div>
				<div class="checkbox-inline">
					<input type="checkbox"name="hobby"id="hobby">唱歌
				</div>
			</div>
			
			<div class="form-group">
				<label>学历：</label>
				<select name="edu"id="edu"/>
				 <option value="1">幼儿园</option>
				 <option value="2">小学</option>
				 <option value="3">初中</option>
				 <option value="4">高中</option>
				 <option value="5">专科</option>
				 <option value="6"selected="selected">本科</option>
				 <option value="7">研究生</option>
				 <option value="8">博士</option>	
				</select>
			</div>
			
			
			<div class="form-group">
				<input class="btn btn-primary"
				type="button"name="submit"value="保存"/>
				<button class="btn btn-danger"name="clear">取消</button>
			</div>
		
		</div>
	</body>
</html>
